<template>
  <div id="app">
    <el-container>
      <el-aside width="200px">
        <el-menu router :default-active="activeIndex" class="el-menu-vertical-demo">
          <!-- 挂号缴费管理 -->
          <el-submenu index="1">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>挂号/缴费</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/guahao">病人挂号</el-menu-item>
              <el-menu-item index="/pay">缴费</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <!-- 门诊医生管理 -->
          <el-submenu index="2">
            <template slot="title">
              <i class="el-icon-s-cooperation"></i>
              <span>门诊管理</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/getRegister">挂号处理</el-menu-item>
            </el-menu-item-group>

            <el-menu-item-group>
              <el-menu-item index="/getProject">项目划价</el-menu-item>
            </el-menu-item-group>

            <el-menu-item-group>
              <el-menu-item index="/getMedicine">药品划价</el-menu-item>
            </el-menu-item-group>
          </el-submenu>

          <!-- 检查项目管理 -->
          <el-submenu index="3">
            <template slot="title">
              <i class="el-icon-document"></i>
              <span>检查项目管理</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/bloodExamination">检查排队</el-menu-item>
            </el-menu-item-group>
            <el-menu-item-group>
              <el-menu-item index="/routineBloodTest">血常规</el-menu-item>
            </el-menu-item-group>
            <el-menu-item-group>
              <el-menu-item index="/routineUrineTest">尿常规</el-menu-item>
            </el-menu-item-group>

            <el-submenu index="3-3">
              <template slot="title">影像检查</template>
              <el-menu-item index="/iconography">影像</el-menu-item>
            </el-submenu>
          </el-submenu>
          <!-- 药品管理 -->
          <el-submenu index="4">
            <template slot="title">
              <i class="el-icon-s-custom"></i>
              <span>医药管理</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/outMedicine">处方出药</el-menu-item>
            </el-menu-item-group>
            <el-menu-item-group>
              <el-menu-item index="/queryMedicine">药品查询</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <!-- 人员管理 -->
          <el-submenu index="4">
            <template slot="title">
              <i class="el-icon-s-custom"></i>
              <span>人员管理</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/arrange">医生排班</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
        </el-menu>
      </el-aside>

      <el-container>
        <el-header>
          <div class="headerClass">
            <el-row :gutter="20">
              <el-col :span="21" style="margin-top60px: ">
                <i class="el-icon-school" style="font-size: 35px; cursor: pointer" @click="toMain"></i>
              </el-col>
              <el-col :span="1">
                <div style="cursor: pointer" @click="toLogin">
                  <el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"></el-avatar>
                </div>
              </el-col>
              <el-col :span="2">
                <div @click="logout" id="logout" style="cursor: poiter; margin-top: 15px">
                  &nbsp;&nbsp;退出
                </div>
              </el-col>
            </el-row>
          </div>
        </el-header>
        <el-main>
          <router-view />
        </el-main>
        <el-divider></el-divider>
        <el-footer>
          <div style="margin-left: 50px; dispaly: inline-block">
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            法律声明 |
            联系我们：028-63125896&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            Copyright © 2021 成都军区总院. All Rights Reserved
            蜀ICP备16010396号-5
          </div>
        </el-footer>
      </el-container>
    </el-container>
  </div>
</template>

<script>
  export default {
    name: "App",
    methods: {
      login() {
        window.location.href = "http://localhost:8081/html/login.html";
      },
      logout() {
        this.$http.get("http://localhost:8088/logout").then((resp) => {
          console.log(resp.data.message);
          console.log(resp.data.data);
          localStorage.removeItem("jwt");
          localStorage.removeItem("doctorId");
          localStorage.removeItem("position");
          console.log(localStorage.getItem("jwt"));
          console.log(localStorage.getItem("doctorId"));
          console.log(localStorage.getItem("position"));
          this.$message({
            showClose: true,
            message: "退出成功",
            type: "success",
          });
          this.$router.push('/login')
          // window.location.href="http://localhost:8081/html/login.html"
        });
      },
      toLogin() {
        this.$router.push("/denglu");
      },
      toMain() {
        this.$router.push("/main");
      },
    },
    data() {
      return {
        activeIndex: "/login",
      }
    },
  };
</script>

<style>
  .headerClass {
    /* background-color: rgb(185, 202, 236); */
    line-height: 10px;
  }

  #login {
    cursor: pointer;
  }

  #logout {
    cursor: pointer;
  }
</style>